<template>
	<view class="" style="width: 100vw;height: 100vh">
		<!-- <view class="content"  style="min-height: 100vh">
			<image class="bg" src="/static/login/log_bg.png" mode="scaleToFill"></image> -->
		<view class="content" :style="{'background':kbackgroundColor}" style="min-height: 100vh">
			<hx-navbar title="免费喝活动" :back="true" :fixed="false" :color="knavTitleColor" barPlaceholder="hidden"
				transparent="auto"></hx-navbar>
			<view class="container">
				<view class="free_image">
					<image v-if="ktheme == 'purple'" class="fimage" src="@/static/free/free_image_purple.png" mode="">
					</image>
					<image v-if="ktheme == 'black'" class="fimage" src="@/static/free/free_image_black.png" mode="">
					</image>
				</view>
				<!-- 活动 -->
				<view class="activity_detail" style="margin-top: -80rpx;"
					:class="[{'activity_detail_black':ktheme =='black'},{'activity_detail_purple':ktheme =='purple'}]"
					:style="selStyle">
					<view class="activity_detail_container">
						<view class="activity">
							<view class="lb_ac"
								:style="{'background':(ktheme=='purple'?'linear-gradient( 270deg, #FF2489 0%, rgba(255,36,137,0) 100%)':'linear-gradient(270deg, #57CC7B 0%, rgba(87, 204, 123, 0) 100%)')}">
							</view>
							<view class="aname" :style="{'color':ktopicAdaptationColors}">
								活动介绍
							</view>
							<view class="lb_ac"
								:style="{'background':(ktheme=='purple'?'linear-gradient( 90deg, #FF2489 0%, rgba(255,36,137,0) 100%)':'linear-gradient(90deg, #57CC7B 0%, rgba(87, 204, 123, 0) 100%)')}">
							</view>
						</view>
						<view class="gf" :style="{'color':ktopicAdaptationColors}" @click="showStoreView">
							查看官方旗舰店
							<image src="@/static/free/jiantuo_purple.png" class="gf_image" v-if="ktheme == 'purple'"
								mode=""></image>
							<image src="@/static/free/jiantou_black.png" class="gf_image" v-if="ktheme == 'black'"
								mode=""></image>
							<image src="@/static/free/jiantuo_purple.png" class="gf_image" v-if="ktheme == 'purple'"
								mode=""></image>
							<image src="@/static/free/jiantou_black.png" class="gf_image" v-if="ktheme == 'black'"
								mode=""></image>
						</view>
						<!--  :style="{'color':ktabNormalColor}" -->
						<view class="ac_cent" style="line-height: 1.6;text-align: left;"
							:style="{'color':(ktheme=='purple'?'#333333':'#acacac')}">
							<view class="">
								1、在官方旗舰店购买卢德堡啤酒；
							</view>
							<view class="">
								2、商品发货1天后进入此页面，在下方提交订单号；
							</view>
							<view class="">
								3、开通收款账户立即获得100元可寄售并立即兑现的数字科技商品“青龙返首，春满乾坤”（冻结15天，如果不产生退货即可立即兑现）；
							</view>
							<view class="">
								4、同时获得初始价值100元数字科技商品“卢德堡·卢克”1组
								（冻结15天并且不产生退货，同时需要购买六瑞系列任意数字科技商品进行解锁）；
							</view>
							<view class="">
								5、在金世界平台购买任意数字科技商品，即可获得初始价值68元的数字科技商品“朱雀衔土，有志竟成”（冻结15天，如果不产生退货即可立即兑现）。
							</view>
						</view>
					</view>
				</view>
				<!-- 商品 -->
				<view class="activity_detail" style="margin-top: 40rpx;"
					:class="[{'activity_detail_black':ktheme =='black'},{'activity_detail_purple':ktheme =='purple'}]"
					:style="selStyle">
					<view class="activity_detail_container">
						<view class="activity">
							<view class="lb_ac"
								:style="{'background':(ktheme=='purple'?'linear-gradient( 270deg, #FF2489 0%, rgba(255,36,137,0) 100%)':'linear-gradient(270deg, #57CC7B 0%, rgba(87, 204, 123, 0) 100%)')}">
							</view>
							<view class="aname" :style="{'color':ktopicAdaptationColors}">
								商品介绍
							</view>
							<view class="lb_ac"
								:style="{'background':(ktheme=='purple'?'linear-gradient( 90deg, #FF2489 0%, rgba(255,36,137,0) 100%)':'linear-gradient(90deg, #57CC7B 0%, rgba(87, 204, 123, 0) 100%)')}">

							</view>
						</view>
						<view class="ac_cent" :style="{'color':ktabNormalColor}">
							<view class="table-container"
								:class="[{'t-c_black':ktheme =='black'},{'t-c_purple':ktheme =='purple'}]">
								<view class="table-header">
									<view class="table-cell_head"
										:style="{'background':(ktheme=='purple'?'#CDA7F9':' linear-gradient( 180deg, rgba(238,245,143,0.9) 0%, rgba(238,245,143,0) 100%)')}">
										<view class="cell_head"
											:style="{'border':(ktheme=='purple'?'1rpx solid rgb(255 36 137 / 39%)':'1rpx solid #f3f87b63')}"
											style="width: 20%;">商品</view>
										<view class="cell_head"
											:style="{'border':(ktheme=='purple'?'1rpx solid rgb(255 36 137 / 39%)':'1rpx solid #f3f87b63')}"
											style="width: 35%;display: flex;flex-direction: column;">
											<view>购买数字版权</view>
											<view>商品赠送价值</view>
										</view>
										<view class="cell_head"
											:style="{'border':(ktheme=='purple'?'1rpx solid rgb(255 36 137 / 39%)':'1rpx solid #f3f87b63')}"
											style="width: 25%;display: flex;flex-direction: column;">
											<view>赠送</view>
											<view>总价值</view>
										</view>
										<view class="cell_head"
											:style="{'border':(ktheme=='purple'?'1rpx solid rgb(255 36 137 / 39%)':'1rpx solid #f3f87b63')}"
											style="width: 20%;display: flex;flex-direction: column;">
											<view>商品</view>
											<view>销售价</view>
										</view>
									</view>
								</view>
								<view class="table-body">
									<view class="table-row" :style="{'color':(ktheme=='purple'?'#333333':'#acacac')}"
										v-for="(item,index) in shopData" :key="index">
										<view class="cell_body"
											:style="{'border':(ktheme=='purple'?'1rpx solid rgb(255 36 137 / 39%)':'1rpx solid #f3f87b63')}"
											style="width: 20%;">{{item.name}}</view>
										<view class="cell_body"
											:style="{'border':(ktheme=='purple'?'1rpx solid rgb(255 36 137 / 39%)':'1rpx solid #f3f87b63')}"
											style="width: 35%;">{{item.val}}</view>
										<view class="cell_body"
											:style="{'border':(ktheme=='purple'?'1rpx solid rgb(255 36 137 / 39%)':'1rpx solid #f3f87b63')}"
											style="width: 25%;">{{item.zsnum}}</view>
										<view class="cell_body"
											:style="{'border':(ktheme=='purple'?'1rpx solid rgb(255 36 137 / 39%)':'1rpx solid #f3f87b63')}"
											style="width: 20%;">{{item.num}}</view>
									</view>
								</view>
							</view>
						</view>
					</view>
				</view>
				<!-- 订单号 -->
				<view class="order_number" :style="{'background':ktabbarBgColor}">
					<input type="text" value="" v-model="numberValue" placeholder="输入卢德堡啤酒订单号"
						:class="[{'order_number_border_black':ktheme =='black'},{'order_number__border_purple':ktheme =='purple'}]"
						:style="[{'background:#000000':ktheme=='black'}]" />
					<view class="btntk" @tap="getPromptly(numberValue)" :style="{background:kbuttonBgColor}">
						领取奖励
					</view>
					<view class="gf" @tap="getAward" :style="{'color':ktopicAdaptationColors}">
						查看我的奖励
						<image src="@/static/free/jiantuo_purple.png" class="gf_image" v-if="ktheme == 'purple'"
							mode=""></image>
						<image src="@/static/free/jiantou_black.png" class="gf_image" v-if="ktheme == 'black'" mode="">
						</image>
						<image src="@/static/free/jiantuo_purple.png" class="gf_image" v-if="ktheme == 'purple'"
							mode=""></image>
						<image src="@/static/free/jiantou_black.png" class="gf_image" v-if="ktheme == 'black'" mode="">
						</image>
					</view>
				</view>
			</view>
		</view>
		<!-- 官方旗舰店 -->
		<uni-popup ref="storePopup" type="bottom" :maskBackgroundColor="'rgba(0,0,0,0)'">
			<view class="store-view store-border-top" :style="{'background':kbackgroundColor,color:knormalColor}"
				:class="[{'alert-border-black':ktheme =='black'},{'alert-border-purple':ktheme =='purple'}]">
				<text class="popup-title">官方旗舰店</text>
				<view class="store-item" v-for="item in storeList">
					<image class="store-image" :src="item.icon"></image>
					<view class="store-column">
						<text class="store-small-title">{{item.name}}</text>
						<text v-if="item.platform" class="store-tag"
							:class="[{'store-buy-black':ktheme =='black'},{'store-buy-white':ktheme =='purple'}]">{{item.platform}}</text>
					</view>
					<view class="store-buy" :style="{'background':kbuttonBgColor}" @click="toStoreBuy(item)">去购买</view>
				</view>
			</view>
		</uni-popup>
		<!-- 获得奖励 -->
		<uni-popup ref="awardPopup" type="center" :maskBackgroundColor="'rgba(0,0,0,0.5)'">
			<view class="store-view store-border-all tips-padding"
				:style="{'background':kbackgroundColor,color:knormalColor}"
				:class="[{'alert-border-black alert-border-shadow-black':ktheme =='black'},{'alert-border-purple':ktheme =='purple'}]">
				<text class="popup-title">获得奖励</text>
				<scroll-view style="height: 400px;" scroll-y="true">
					<view class="store-item" v-for="item in enableAwardList">
						<image class="store-image" :src="item.image"></image>
						<view class="store-column">
							<text class="store-title">{{item.name || ''}}</text>
							<text class="store-tag"
								:class="[{'store-buy-black':ktheme =='black'},{'store-buy-white':ktheme =='purple'}]">初始价值￥{{(Math.floor(item.price / 100)) || 0}}</text>
							<text class="store-number">x{{item.num || 0}}</text>
						</view>
						<view class="store-buy" :style="{'background':kbuttonBgColor}" @tap="receiveAward(item)">去领取
						</view>
					</view>
					<view class="popup-disabel-title">以下奖品需要在平台购买任意藏品才可领取</view>
					<view class="store-item" v-for="item in disableAwardList" style="filter: grayscale(80%);">
						<image class="store-image" :src="item.image"></image>
						<view class="store-column">
							<text class="store-title">{{item.name || ''}}</text>
							<text class="store-tag"
								:class="[{'store-buy-black':ktheme =='black'},{'store-buy-white':ktheme =='purple'}]">初始价值￥{{item.price/100 || 0}}</text>
							<text class="store-number">x{{item.num || 0}}</text>
						</view>
						<view class="store-buy" :style="{'background':kbuttonBgColor}" @tap="receiveAward(item)">去领取
						</view>
					</view>
				</scroll-view>
			</view>
		</uni-popup>
		<!-- 提醒 -->
		<uni-popup ref="tipsPopup" type="center" :maskBackgroundColor="'rgba(0,0,0,0.5)'" :isMaskClick="false">
			<view class="store-view store-border-all tips-padding"
				:style="{'background':kbackgroundColor,color:knormalColor}"
				:class="[{'alert-border-black alert-border-shadow-black':ktheme =='black'},{'alert-border-purple':ktheme =='purple'}]">
				<text class="popup-title">提醒</text>
				<text class="popup-subtitle">为保障您可以顺利领取奖励，请进行开户，开户成功后，奖品将发放到您的金世界账户中。</text>
				<view class="tips-bottom">
					<view class="tips-button"
						:class="[{'tips-cancel-bg-black':ktheme =='black'},{'tips-cancel-bg-white':ktheme =='purple'}]"
						@click="cancelAward()">放弃奖励</view>
					<view class="tips-button" :style="{background:kbuttonBgColor}" @click="openAccount()">去开户</view>
				</view>
			</view>
		</uni-popup>
		<!-- 实名 -->
		<uni-popup ref="tipsAuthPopup" type="center" :maskBackgroundColor="'rgba(0,0,0,0.5)'" :isMaskClick="false">
			<view class="store-view store-border-all tips-padding"
				:style="{'background':kbackgroundColor,color:knormalColor}"
				:class="[{'alert-border-black alert-border-shadow-black':ktheme =='black'},{'alert-border-purple':ktheme =='purple'}]">
				<text class="popup-title">提醒</text>
				<text class="popup-subtitle">为保障您可以顺利领取奖励，请先进行实名认证</text>
				<view class="tips-bottom">
					<view class="tips-button"
						:class="[{'tips-cancel-bg-black':ktheme =='black'},{'tips-cancel-bg-white':ktheme =='purple'}]"
						@click="cancelAuth()">放弃认证</view>
					<view class="tips-button" :style="{background:kbuttonBgColor}" @click="openAuth()">去认证</view>
				</view>
			</view>
		</uni-popup>
		<!-- 购买 提醒 -->
		<uni-popup ref="noBuyPopup" type="center" :maskBackgroundColor="'rgba(0,0,0,0.5)'" :isMaskClick="false">
			<view class="store-view store-border-all tips-padding"
				:style="{'background':kbackgroundColor,color:knormalColor}"
				:class="[{'alert-border-black alert-border-shadow-black':ktheme =='black'},{'alert-border-purple':ktheme =='purple'}]">
				<text class="popup-title">提醒</text>
				<text class="popup-subtitle">以下奖品需要在一级市场购买任意数字科技商品，购买后可领取</text>
				<view class="tips-bottom">
					<view class="tips-button"
						:class="[{'tips-cancel-bg-black':ktheme =='black'},{'tips-cancel-bg-white':ktheme =='purple'}]"
						@click="closeNoBuyAward()">取消</view>
					<view class="tips-button" :style="{background:kbuttonBgColor}" @click="pushHome()">
						去购买</view>
				</view>
			</view>
		</uni-popup>
		<!-- 领取成功 -->
		<uni-popup ref="awardSuccessPopup" type="center" :maskBackgroundColor="'rgba(0,0,0,0.5)'" :isMaskClick="false">
			<view class="store-view store-border-all" :style="{'background':kbackgroundColor,color:knormalColor}"
				:class="[{'alert-border-black alert-border-shadow-black':ktheme =='black'},{'alert-border-purple':ktheme =='purple'}]">
				<view class="freeze-row store-border-top"
					:class="[{'freeze-row-black':ktheme =='black'},{'freeze-row-white':ktheme =='purple'}]">
					<image class="freeze-icon" src="../../static/free/freeze-icon.png" mode="aspectFit"></image>
					<text class="freeze-text">冻结{{dayCount || 0}}天</text>
				</view>
				<text class="popup-title">领取成功</text>
				<view class="store-item">
					<image class="store-image" :src="recivedItem.image"></image>
					<view class="store-column">
						<text class="store-title">{{recivedItem.name || ''}}</text>
						<text class="store-number">x{{recivedItem.num || 0}}</text>
					</view>
					<image class="award-success-icon" src="../../static/free/award-success-icon.png" mode="aspectFit">
					</image>
				</view>
				<view class="tips-bottom">
					<view class="tips-button"
						:class="[{'tips-cancel-bg-black':ktheme =='black'},{'tips-cancel-bg-white':ktheme =='purple'}]"
						@click="closeAward()">关闭</view>
					<view class="tips-button" :style="{background:kbuttonBgColor}" @click="showArtGood(recivedItem)">
						查看商品</view>
				</view>
			</view>
		</uni-popup>
	</view>
	</view>
</template>

<script>
	import * as common from '@/config/common.js';
	export default {
		data() {
			return {
				// 用户token
				userToken: '',
				// 订单号
				numberValue: '',
				// 奖品列表
				enableAwardList: [],
				// 不可用奖品列表
				disableAwardList: [],
				// 领取的奖品信息
				recivedItem: {},
				// 冻结天数
				dayCount: 0,
				submiting: false,
				shopData: [{
						id: 1,
						name: '混合装630ML*6',
						val: '初始价值68元数字科技商品 “朱雀衔土，有志竟成”',
						zsnum: '100+100+68=268',
						num: '328'
					},
					// {
					// 	id: 2,
					// 	name: '艾皮诶630ML*',
					// 	val: '初始价值208数字版权商品（9.9+198.1玉璜）',
					// 	zsnum: '100+100+208=408',
					// 	num: '408'
					// },
					// {
					// 	id: 3,
					// 	name: '艾尔630ML*6',
					// 	val: '初始价值88数字版权商品（9.9+78.1玉璋）',
					// 	zsnum: '100+100+88=288',
					// 	num: '288'
					// },
					// {
					// 	id: 4,
					// 	name: '世涛630ML*6',
					// 	val: '初始价值148数字版权商品（9.9+138.1玉琥）',
					// 	zsnum: '100+100+208=408',
					// 	num: '408'
					// },
				],
				storeList: [{
						id: 1,
						name: '一只猫精酿啤酒官方旗舰店 ',
						platform: '京东店铺',
						url: 'https://mall.jd.com/index-12280322.html',
						icon: require('../../static/free/store-jd.png')
					},
					// {
					// 	id: 2,
					// 	name: 'MASTER CAT啤酒官方旗舰店 ',
					// 	platform: '拼多多店铺',
					// 	url:'https://mobile.yangkeduo.com/mall_page.html?_x_org=2&refer_share_uin=CFNWBDBUXIAQFX4OSRUNYFHD2A_GEXDA&refer_share_id=rsUzbHdYHAWZ19q1TWpD04KM4efKngyu&_x_query=MASTER%20CAT%E5%95%A4%E9%85%92%E5%AE%98%E6%96%B9%E6%97%97%E8%88%B0%E5%BA%97&msn=l5rgx5u2zkccyy32sej7rydizi_axbuy&refer_share_channel=copy_link&_wv=41729&mall_id=440290841&_wvx=10',
					// 	icon:require('../../static/free/store-pdd.png')
					// },
					{
						id: 3,
						name: '山东卢德堡精酿啤酒有限公司 ',
						platform: '阿里巴巴店铺',
						url: 'https://shop498318o18x068.1688.com/?spm=a26352.13672862.offerlist.14.25dd5b02sTamlL',
						icon: require('../../static/free/store-tb.png')
					},
					{
						id: 4,
						name: '卢德堡精酿馆',
						platform: '淘宝店铺',
						url: 'https://shop525460550.taobao.com/?spm=a230r.7195193.1997079397.9.c0f72cdecoStHu#/',
						icon: require('../../static/free/store-tb.png')
					},
					{
						id: 5,
						name: '傢依生活',
						platform: '',
						url: 'https://jy-life.zhongfujiayi.com',
						icon: require('../../static/free/store-jy.png')
					},
				],

			}
		},
		onShow() {
			this.userToken = this.$db.get('userToken')
			if (!this.userToken) {
				common.jumpToLogin();
			}
		},
		onLoad() {

		},
		onPullDownRefresh() {
			setTimeout(function() {
				uni.stopPullDownRefresh()
			}, 1000)
		},
		methods: {
			getPromptly(val) {
				if (!this.userToken) {
					common.jumpToLogin();
					return;
				}
				if (val == "") {
					this.toast('你还没有填写编号')
				} else {
					if (!this.submiting) {
						this.submiting = true;
						setTimeout(() => {
							this.submiting = false
						}, 5000);
						let data = {
							token: this.userToken,
							orderId: val
						}
						// MFH_ORDER_NOT_EXIST(59001, "订单不存在"),
						// MFH_AUDIT_NOT_EXIST(59002, "审核状态不能为空"),
						// MFH_ORDER_NOT_AUDIT(59003, "订单非已审核状态"),
						// MFH_USER_NOT_BUY(59004, "用户未在一级市场购买过藏品"),
						// MFH_ACCESS_HAS_GET(59005, "奖品已领取"),
						// MFH_ACCESS_NOT_PERMIT(59006, "不可获得的奖品");
						this.$api.mfvValidByOrderId(data, res => {
							if (res.code != "0") {
								let message = res.message || '网络不给力'
								this.toast(message)
							} else if (res.code == 59009) {
								let message = '订单已校验，请去我的奖励中查看'
								this.toast(message)
							} else {
								let list = res.data
								let enableAwardList = []
								let disableAwardList = []
								list.forEach(item => {
									if (item.needBuy) {
										disableAwardList.push(item)
									} else {
										enableAwardList.push(item)
									}
								})
								this.enableAwardList = enableAwardList
								this.disableAwardList = disableAwardList
								this.$refs.awardPopup.open()
							}
						})
					} else {
						this.$common.errorToShow('操作太快了稍后再试')
					}
				}
			},
			// 旗舰店列表
			showStoreView() {
				this.$refs.storePopup.open()
				// this.$refs.awardPopup.open()
				// this.$refs.tipsPopup.open()
				// this.$refs.tipsAuthPopup.open()
				// this.$refs.awardSuccessPopup.open()
			},
			// 奖励弹窗
			showAwardAlertView() {
				this.$refs.awardPopup.open()
			},
			// 提醒弹窗
			showTipsAlertView() {
				this.$refs.tipsPopup.open()
			},
			// 领取成功
			showAwardSuccessAlertView() {
				this.$refs.awardSuccessPopup.open()
			},
			// 放弃奖励
			cancelAward() {
				this.$refs.tipsPopup.close()
			},
			// 去开户
			openAccount() {
				this.$refs.tipsPopup.close()
				this.$api.hfwallet(res => {
					if (res.status) {
						let url = res.data.url;
						// #ifdef H5
						window.location.href = url;
						// #endif
						// #ifdef APP-PLUS
						uni.navigateTo({
							url: '/pages/user/webview/webview?url=' + url
						})
						// #endif
					} else {
						uni.showToast({
							icon: "none",
							title: res.message
						})
					}
				})
			},
			// 关闭奖励成功弹窗
			closeAward() {
				this.$refs.awardSuccessPopup.close()
				if (this.enableAwardList.length == 0) {
					this.$refs.awardPopup.close()
				}
			},
			// 关闭购买过藏品弹窗
			closeNoBuyAward() {
				this.$refs.noBuyPopup.close()
			},
			// 放弃认证
			cancelAuth() {
				this.$refs.tipsAuthPopup.close()
			},
			// 去认证
			openAuth() {
				this.$refs.tipsAuthPopup.close()
				uni.navigateTo({
					url: "/pages/user/apply/apply"
				})
			},
			// 查看藏品
			showArtGood(item) {
				this.$refs.awardSuccessPopup.close()
				uni.navigateTo({
					url: `/pages/index/details?id=${item.iid || 0}`
				})
			},
			//我的奖励列表
			getAward() {
				uni.navigateTo({
					url: '/pages/free/award'
				})
			},
			//去购买
			pushHome() {
				this.$refs.noBuyPopup.close()
				uni.switchTab({
					url: '/pages/index/index'
				})
			},
			// 跳转到旗舰店购买
			toStoreBuy(item) {
				this.$refs.storePopup.close()
				// window.location.href = item.url;
				// #ifdef H5
				window.location.href =  item.url;
				// #endif
				// #ifdef APP-PLUS
				plus.runtime.openURL(item.url)
				// #endif
			},
			resetEnableAwardList() {
				var array = []
				this.enableAwardList.forEach(item => {
					if (this.recivedItem.iid != item.iid) {
						array.push(item)
					}
				})
				this.enableAwardList = array
			},
			// 接收奖励
			receiveAward(item) {
				this.recivedItem = item
				let data = {
					mfhId: item.mfhId,
					iid: item.iid,
					token: this.userToken
				}
				this.$api.mfvAccessByMfhId(data, res => {
					if (res.code == 52002) {
						// 未实名认证
						this.$refs.tipsAuthPopup.open()
					} else if (res.code == 52011) {
						// 开户
						this.$refs.tipsPopup.open()
					} else if (res.code == 59004) {
						// 用户未在一级市场购买过藏品
						this.$refs.noBuyPopup.open()
					} else if (res.code == 0) {
						// 计算冻结时间
						this.dayCount = 0;

						// 将日期设置为后一天的0点0分0秒0毫秒
						const now = new Date();
						now.setHours(0, 0, 0, 0);
						now.setDate(now.getDate() + 1);
						let beforeTimes = Math.floor(now);
						var nextDayTimestamp = Math.floor(item.unfrozeDate) + Math.floor(24 * 60 * 60 *
						1000); // 一天的毫秒数
						let remainingSeconds = nextDayTimestamp - beforeTimes;
						if (remainingSeconds > 0) {
							var day = Math.floor(remainingSeconds / (24 * 3600 * 1000))
							this.dayCount = day
						}
						// this.$refs.awardPopup.close()
						this.resetEnableAwardList()
						this.$refs.awardSuccessPopup.open()
						if (this.enableAwardList.length == 0) {
							this.$refs.awardPopup.close()
						}
					} else {
						let message = res.message || '网络不给力'
						this.toast(message)
					}
				})
			},
			// 藏品详情
			pushAwardDetail(item) {
				this.$refs.awardPopup.close()
				uni.switchTab({
					url: '/pages/index/index'
				})
				// uni.navigateTo({
				// 	url: `/pages/index/details?id=${item.iid || 0}`
				// })
			},
			toast(val) {
				uni.showToast({
					title: val,
					icon: 'none',
				});
			}
		}
	}
</script>

<style scoped lang="scss">
	.container {
		width: 100%;
	}

	.fimage {
		z-index: -1;
		width: 100%;
		height: 372rpx;

		.fimage {
			width: 100%;
			height: 100%;
		}
	}

	.activity_detail_purple {
		box-shadow: 2rpx 2rpx 12rpx 4rpx #51515166;
		background-clip: padding-box, border-box;
		box-shadow: inset 0rpx 0rpx 50rpx 0rpx rgba(254, 162, 221, 0.91);
		background-color: #fff;
	}

	.activity_detail_black {
		box-shadow: 2rpx 2rpx 12rpx 4rpx #51515166;
		border: 6rpx solid transparent;
		background-clip: padding-box, border-box;
		box-shadow: inset 0rpx 0rpx 50rpx 0rpx rgba(88, 204, 123, 0.9);
		background-origin: padding-box, border-box;
		background-image: linear-gradient(to bottom, #000, #000), linear-gradient(180deg, rgba(244, 249, 123, 1), rgba(84, 203, 122, 1));
	}

	.activity_detail {
		margin: auto;
		width: 673rpx;
		border-radius: 16px;

		.activity_detail_container {
			width: 600rpx;
			margin: 12rpx auto;

			.activity {
				display: flex;
				padding-top: 20rpx;
				justify-content: center;
				align-items: center;

				.lb_ac {
					width: 112rpx;
					height: 10rpx;
				}

				.aname {
					width: 196rpx;
					height: 68rpx;
					font-family: PingFangSC, PingFang SC;
					font-weight: 500;
					font-size: 34rpx;
					line-height: 68rpx;
					text-align: center;
					font-style: normal;
				}
			}

			.ac_cent {
				width: 620rpx;
				margin: 20rpx auto;
				padding-bottom: 20rpx;
				font-family: PingFangSC, PingFang SC;
				font-weight: 400;
				font-size: 30rpx;
				text-align: center;
				font-style: normal;
			}
		}
	}

	.size_free {
		text-align: center;
		font-family: HuXiaoBo, HuXiaoBo;
		font-weight: bold;
		font-size: 60rpx;
		text-shadow:
			-3px -2px 0 white,
			/* 左上角阴影 */
			0px -1px 0 white,
			/* 右上角阴影 */
			-1px 1px 0 white,
			/* 左下角阴影 */
			2px 1px 0 white,
	}

	.t-c_black {
		box-shadow: 2rpx 2rpx 12rpx 4rpx #51515166;
		background-clip: padding-box, border-box;
		background-origin: padding-box, border-box;
		background-image: linear-gradient(to right, #222, #222), linear-gradient(90deg, rgba(244, 249, 123, 1), rgba(84, 203, 122, 1));
		border-collapse: collapse;
	}

	.t-c_purple {
		border-collapse: collapse;
		box-shadow: 2rpx 2rpx 12rpx 4rpx #51515166;
		background-clip: padding-box, border-box;
		background-origin: padding-box, border-box;
		background-image: linear-gradient(to right, #ffffff, #ffffff), linear-gradient(90deg, #ff81a9, #FF2489);
	}

	.table-container {
		/* 合并相邻的边框 */
		width: 600rpx;
		border: 4rpx solid transparent;
		border-radius: 16rpx;
	}

	.gf {
		margin: 20rpx auto;
		width: 282rpx;
		text-align: center;
		height: 36rpx;
		font-family: PingFangSC, PingFang SC;
		font-weight: 400;
		font-size: 26rpx;
		line-height: 36rpx;
		font-style: normal;
		display: flex;
		align-items: center;
		justify-content: center;

		.gf_image {
			padding-left: 10rpx;
			width: 16rpx;
			height: 26rpx;
			line-height: 36rpx;
		}
	}

	.table-wrapper {
		border: 2rpx solid #ffb3d7;
		// margin: 25rpx auto;
		border-radius: 8px;
		width: 626rpx;
	}

	.table {
		border-collapse: collapse;
	}

	.row {
		display: flex;
	}

	.header {
		border-radius: 12rpx 12rpx 0 0;
		// line-height: 70rpx;
		font-weight: bold;
		// line-height: 100rpx;
		background: linear-gradient(225deg, #EAB6FA 0%, #F9A7C4 100%);
	}

	.th {
		.cell {
			border: 1px solid #f5a6cb52;
		}
	}

	.tb {
		.cell {
			border: 1px solid #F5ACCE;
		}
	}

	.cell_head {
		height: 120rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		font-weight: 500;
		font-size: 28rpx;
		color: #FFFFFF;
	}

	.cell_body {
		font-size: 24rpx;
		word-break: break-all;
		height: 130rpx;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.table-header {
		display: flex;
		border-radius: 15rpx 15rpx 0rpx 0rpx;
	}

	.table-header,
	.table-body {
		// display: flex;		word-wrap: break-word;
		// flex-direction: row;
	}

	.table-cell_head {
		text-align: center;
		display: flex;
		word-wrap: break-word;
		font-weight: 500;
		font-size: 28rpx;
		width: 100%;
		// height: 130rpx;
		line-height: 40rpx;
		//border: 1px solid transparent;
		/* 为了显示边框，先设置为透明 */
		// padding: 10px;
		border-radius: 15rpx 15rpx 0rpx 0rpx;
	}

	.table-cell {
		// flex: 1;
		font-size: 24rpx;
		text-align: center;
		word-wrap: break-word;

		// width: 25%;
		height: 130rpx;
		//border: 1px solid transparent;
		/* 为了显示边框，先设置为透明 */
		// padding: 10px;
		position: relative;
	}

	.table-body {
		// display: flex;
	}

	.table-row {
		// width: 25%;
		display: flex;
	}

	.table-cell2 {
		width: 100%;
		height: 100rpx;
		line-height: 100rpx;
	}

	// 订单
	.order_number {
		width: 100%;
		height: 420rpx;
		margin: 30rpx auto;
		padding: 20rpx;

	}

	.order_number__border_purple {
		border-radius: 20rpx;
		border: 2rpx solid #dfdfdf;
		width: 637rpx;
		height: 92rpx;
		margin: 40rpx auto;
	}

	/deep/.order_number .uni-input-input {
		color: #c7c7c7;
		padding-left: 20rpx;
	}

	/deep/ .order_number .uni-input-placeholder {
		color: #c7c7c7;
		padding-left: 20rpx;
	}

	.order_number_border_black {
		width: 637rpx;
		height: 92rpx;
		margin: 40rpx auto;
		border-radius: 8px;
		padding: 14rpx;
		border: 4rpx solid transparent;
		background-clip: padding-box, border-box;
		background-origin: padding-box, border-box;
		background-image: linear-gradient(to right, #222, #222), linear-gradient(180deg, rgba(244, 249, 123, 1), rgba(84, 203, 122, 1));
	}

	.btntk {
		width: 590rpx;
		height: 80rpx;
		margin: 30rpx auto 40rpx;
		border-radius: 100rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 32rpx;
		color: #fff;
		font-weight: 400;
	}

	//提示弹框
	.hintpopup {
		width: 670rpx;
		height: 392rpx;
		border: 4rpx solid transparent;
		border-radius: 16rpx;
		// height: 600rpx;
		padding: 14rpx;
		text-align: center;
	}

	.h_black {
		background-clip: padding-box, border-box;
		background-origin: padding-box, border-box;
		background-image: linear-gradient(to right, #222, #222), linear-gradient(90deg, rgba(244, 249, 123, 1), rgba(84, 203, 122, 1));
		color: #fff;
	}

	.h_puple {
		background: #FFFFFF;
		color: #000000;
	}

	.ts_name {
		width: 124rpx;
		height: 64rpx;
		font-family: PingFangSC, PingFang SC;
		font-weight: 500;
		font-size: 32rpx;
		margin: 20rpx auto;
		line-height: 64rpx;
		text-align: center;
		font-style: normal;
	}

	.ts_cont {
		width: 580rpx;
		margin: 30rpx auto 20rpx;
		font-family: PingFangSC, PingFang SC;
		font-weight: 400;
		font-size: 32rpx;
		text-align: left;
		font-style: normal;
	}

	.ts_botton {
		display: flex;
		justify-content: space-around;

		.tsb {
			width: 240rpx;
			height: 80rpx;
			line-height: 80rpx;
			text-align: center;
			border-radius: 40rpx;
		}
	}

	.alert-border-purple {
		box-shadow: 2rpx 2rpx 12rpx 4rpx #51515166 !important;
		box-shadow: inset 0rpx 0rpx 50rpx 0rpx rgba(254, 162, 221, 0.91) !important;
		background-color: #fff !important;
	}

	.alert-border-black {
		border: 1px solid #FFD38C;
	}

	.alert-border-shadow-black {
		// box-shadow: inset 0rpx 0rpx 50rpx 0rpx rgba(88, 204, 123, 0.9) !important;
	}

	.store-border-top {
		border-top-left-radius: 40rpx;
		border-top-right-radius: 40rpx;
	}

	.store-border-all {
		border-radius: 40rpx;
		width: 660rpx;
	}

	.tips-padding {
		margin: 0 40rpx;
	}

	.store-view {
		display: flex;
		flex-direction: column;
		margin-bottom: -6rpx;
		max-height: 1000rpx;

		.tips-bottom {
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: space-between;
			font-size: 28rpx;
			margin: 0 40rpx 40rpx 40rpx;

			.tips-button {
				padding: 20rpx 0;
				width: 240rpx;
				text-align: center;
				border-radius: 40rpx;
				color: white;
			}

			.tips-cancel-bg-black {
				border: 2rpx #1CBC4D solid;
				background: #333333;
				color: white;
			}

			.tips-cancel-bg-white {
				border: 2rpx #999999 solid;
				background: white;
				color: #333333;
			}
		}

		.freeze-row-black {
			background: rgba(255, 0, 0, 0.5);
		}

		.freeze-row-white {
			background: rgba(255, 0, 0, 0.1);
		}

		.freeze-row {
			display: flex;
			flex-direction: row;
			align-items: center;
			padding: 14rpx 40rpx;
			width: 100%;

			.freeze-icon {
				width: 34rpx;
				height: 28rpx;
			}

			.freeze-text {
				color: #EA4729;
				margin-left: 20rpx;
			}
		}

		.popup-title {
			width: 100%;
			margin-top: 40rpx;
			text-align: center;
		}

		.popup-subtitle {
			font-size: 28rpx;
			padding: 40rpx;
		}

		.popup-disabel-title {
			color: #F65656;
			font-size: 28rpx;
			padding: 40rpx;
		}

		.store-item {
			padding: 20rpx 40rpx;
			display: flex;
			flex-direction: row;
			align-items: center;

			.store-image {
				width: 100rpx;
				height: 100rpx;
			}

			.store-column {
				display: flex;
				flex-direction: column;
				margin: 0 20rpx;
				position: relative;
				width: 50%;

				.store-title {
					font-size: 30rpx;
				}

				.store-small-title {
					font-size: 26rpx;
				}

				.store-tag {
					padding: 4rpx 18rpx;
					font-size: 24rpx;
					margin-top: 6rpx;
					margin-right: auto;
				}

				.store-number {
					margin-top: 4rpx;
					font-size: 24rpx;
				}
			}

			.award-success-icon {
				width: 200rpx;
				height: 160rpx;
			}

			.store-buy {
				margin-left: auto;
				padding: 8rpx 30rpx;
				border-radius: 46rpx;
				font-size: 26rpx;
				color: white;
			}

			.store-buy-black {
				border-radius: 8rpx;
				border: 2rpx #58CC7B solid;
				background-color: rgba(88, 204, 123, 0.20);
				color: #58CC7B;
			}

			.store-buy-white {
				border-radius: 8rpx;
				border: 2rpx #999999 solid;
				background-color: white;
				color: #333333;
			}
		}
	}
</style>